import { useEffect } from "react";
import { Button, message, Space, Form, Input, Popconfirm, Avatar } from "antd";
import { useModel } from "umi";
import { useReactive } from "ahooks";
import { validate as uuidValidate } from "uuid";

import userGatewayRegister from "../../hooks/person/userGatewayRegister";
import userSaveGatewayInfo from "../../hooks/person/userSaveGatewayInfo";

const AddGateway = ({ gateways, reloadData }) => {
    const { baseInfo } = useModel("person.info");
    const { onCloseGlobalModal } = useModel("global.modal");
    const [form] = Form.useForm();
    const { loading, personGatewayRegister } = userGatewayRegister();
    const { saveGatewayInfo } = userSaveGatewayInfo();

    const onFinish = async (values) => {
        personGatewayRegister(values, baseInfo, (res) => {
            if (res) {
                const { personInfo, serviceInfo, publicKey } = res;
                if (personInfo.verifyStatus === false) return message.warning("注册成功，等待个人网关管理员审核");
                message.success("注册成功");
                let data = { ...personInfo, ...values, uuid: serviceInfo.uuid, publicKey, personUuid: baseInfo.uuid };
                saveGatewayInfo(data, (res) => {
                    if (res) {
                        message.success("网关信息保存成功");
                        reloadData();
                        onCloseGlobalModal();
                    }
                });
            }
        });
    };

    const gatewayUrlValidator = async (rule, value) => {
        if (value && validates.isURL(value)) {
            return Promise.resolve();
        } else {
            return Promise.reject("请输入正确的个人数据网关地址");
        }
    };

    const gatewayUuidValidator = async (rule, value) => {
        if (value && uuidValidate(value)) {
            return Promise.resolve();
        } else {
            return Promise.reject("请输入正确的个人数据网关UUID");
        }
    };

    return (
        <Form form={form} layout="horizontal" onFinish={onFinish} style={{ padding: 20 }} labelAlign="right" labelCol={{ span: 4 }}>
            <Form.Item label="网关地址" name="url" rules={[{ required: true, validator: gatewayUrlValidator }]}>
                <Input placeholder="请输入网关地址" />
            </Form.Item>

            <Form.Item label="网关UUID" name="uuid" rules={[{ required: true, validator: gatewayUuidValidator }]}>
                <Input placeholder="请输入网关UUID" />
            </Form.Item>

            <Form.Item label="网关备注" name="notes">
                <Input placeholder="请输入网关备注" />
            </Form.Item>

            <div style={{ textAlign: "center" }}>
                <Button loading={loading} type="primary" htmlType="submit">
                    保存
                </Button>

                <Button loading={loading} onClick={() => form.resetFields()} style={{ margin: "0 20px" }}>
                    重置
                </Button>

                <Button loading={loading} onClick={onCloseGlobalModal}>
                    取消
                </Button>
            </div>
        </Form>
    );
};

export default AddGateway;
